<template>
    <div style="padding: 10px;">
        <el-row :gutter="10" class="mb8">
            <el-col :span="1.5" class="buttonsRow">
                <el-button type="text" plain @click="()=>triggerModify()">新增执行器</el-button>
            </el-col>
        </el-row>
        <section class="tablecontainer">
            <el-table border ref="multipleTable" :data="dataList" size="mini" class="tabletop" tooltip-effect="dark"
                      style="width: 100%" @selection-change="rows=>{         selectRows=rows      }"
                      @row-click="row=>{          tableRowClickOnece(row,'multipleTable')      }"
                      :row-class-name="tableRowClassName">
                <!--                <el-table-column type="selection" width="40"></el-table-column>-->
                <el-table-column v-if="!columnsHidden['handleCode']" label="执行器名称" prop="handleCode"
                                 min-width="120px;">
                    <template slot-scope="scope">
                        <el-button
                                @click="()=>triggerSeeHanlder(scope.row)"
                                type="text">{{scope.row.handleName}}
                        </el-button>
                        <!--     <el-popover
                                     placement="top-start"
                                     width="400"
                                     trigger="click"
                                     @hide="()=>{
                                          visibleMap[`${scope.row.id}`]=false
                                     }"
                                     @show="()=>{
                                          visibleMap[`${scope.row.id}`]=true
                                     }"
                             >
                             <div>
                             &lt;!&ndash;src/views/bnpmList/form/eventhandlers/modify.vue:11&ndash;&gt;
                                 <eventhandlersModify :ref="`eventhandlersModify_${scope.row.id}`"
                                     :item="scope.row.handlerData"
                                     v-if="visibleMap[`${scope.row.id}`]"
                                      actionProps="readOnly"
                                     :immediate="true"
                                 ></eventhandlersModify>
                             </div>
                                 <el-button slot="reference"
                                            type="text"
                                 >{{scope.row.handleName}}
                                 </el-button>
                             </el-popover>-->
                    </template>
                </el-table-column>
                <!--  <el-table-column v-if="!columnsHidden['handleId']" label="后置执行器ID" prop="handleId" min-width="120px;">
                      <template slot-scope="scope">
                          <div> {{scope.row.handleId}}</div>
                      </template>
                  </el-table-column>-->
                <el-table-column v-if="!columnsHidden['handleStage']" label="执行阶段" prop="handleStage"
                                 min-width="120px;">
                    <template slot-scope="scope">
                        <dic-tag v-model="scope.row.handleStage"
                                 :code="dicInner.mes_bpm_pipiline_handle_handleStage"></dic-tag>
                    </template>
                </el-table-column>
                <!--  <el-table-column v-if="!columnsHidden['state']" label="状态" prop="state" min-width="120px;">
                      <template slot-scope="scope">
                          <dic-tag :code="dicInner.mes_bpm_pipeline_handle_state" v-model="scope.row.state"></dic-tag>
                      </template>
                  </el-table-column>-->
                <el-table-column label="操作" width="66" fixed="right">
                    <template slot-scope="scope">
                        <el-popover placement="top-start" title="操作" width="222" trigger="hover">
                            <div>
                                <el-button size="mini" type="text" icon="el-icon-edit"
                                           @click="()=>triggerModify(scope.row)"> 修改
                                </el-button>
                                <!--   <el-button size="mini" type="text" icon="el-icon-notebook-1"
                                              @click="()=>openLog(scope.row)">变更日志
                                   </el-button>-->
                                <el-button size="mini" type="text" icon="el-icon-delete"
                                           @click="()=>handleDelete(scope.row)">删除
                                </el-button>
                            </div>
                            <el-button slot="reference" type="text">操作</el-button>
                        </el-popover>
                    </template>
                </el-table-column>
            
            </el-table>
            <el-pagination :background="true" style="padding: 20px;" :current-page.sync="queryParams.pageNum"
                           :page-size="queryParams.pageSize" layout="prev, pager, next" :total="total"
                           @size-change="(pageSize)=>{$data.queryParams.pageSize=pageSize;dataList=[];getInfoList();}"
                           @current-change="(pageNum)=>{$data.queryParams.pageNum=pageNum;dataList=[];getInfoList();}"></el-pagination>
        </section>
    </div>
</template>
<script>  import { formData, formMethod, PageData } from '@/utils/formcommon';
import { getUrlParam, dateFormatYYYYMMDD } from '@/utils/index';
import { default as FormDialog } from '@codegenarate/mydialogplus';
import * as  api from '@/apis/mesBpmPipelineHandle.api.js';

const dicInner = {
  '___mes_bpm_pipeline_handle_id': '主键ID',
  'mes_bpm_pipeline_handle_id': 'mes_bpm_pipeline_handle_id',
  '___mes_bpm_pipeline_handle_bpmId': '对应新品开发id',
  'mes_bpm_pipeline_handle_bpmId': 'mes_bpm_pipeline_handle_bpmId',
  '___mes_bpm_pipeline_handle_bpmNodeId': '对应业务流程节点id',
  'mes_bpm_pipeline_handle_bpmNodeId': 'mes_bpm_pipeline_handle_bpmNodeId',
  '___mes_bpm_pipeline_handle_nodeCode': '节点标识',
  'mes_bpm_pipeline_handle_nodeCode': 'mes_bpm_pipeline_handle_nodeCode',
  '___mes_bpm_pipeline_handle_deep': '节点深度',
  'mes_bpm_pipeline_handle_deep': 'mes_bpm_pipeline_handle_deep',
  '___mes_bpm_pipeline_handle_handleCode': '后置执行器标识码',
  'mes_bpm_pipeline_handle_handleCode': 'mes_bpm_pipeline_handle_handleCode',
  '___mes_bpm_pipeline_handle_handleId': '后置执行器ID',
  'mes_bpm_pipeline_handle_handleId': 'mes_bpm_pipeline_handle_handleId',
  '___mes_bpm_pipeline_handle_handleStage': '执行阶段 1、节点生成、 2、节点指派、3、节点接单、4、节点开始、5、资料校验、6、节点结束',
  'mes_bpm_pipeline_handle_handleStage': 'mes_bpm_pipeline_handle_handleStage',
  '___mes_bpm_pipeline_handle_state': '状态 1 正常  5暂停 10废除',
  'mes_bpm_pipeline_handle_state': 'mes_bpm_pipeline_handle_state',
  '___mes_bpm_pipeline_handle_remarks': '备注',
  'mes_bpm_pipeline_handle_remarks': 'mes_bpm_pipeline_handle_remarks',
  '___mes_bpm_pipeline_handle_tenantType': '租户类型 1应用管理者2应用消息者',
  'mes_bpm_pipeline_handle_tenantType': 'mes_bpm_pipeline_handle_tenantType',
  '___mes_bpm_pipeline_handle_tenantId': '租户ID',
  'mes_bpm_pipeline_handle_tenantId': 'mes_bpm_pipeline_handle_tenantId',
  '___mes_bpm_pipeline_handle_delState': '有效状态[数据字典=del_state] 1有效  5删除',
  'mes_bpm_pipeline_handle_delState': 'mes_bpm_pipeline_handle_delState',
  '___mes_bpm_pipeline_handle_addUser': '添加人',
  'mes_bpm_pipeline_handle_addUser': 'mes_bpm_pipeline_handle_addUser',
  '___mes_bpm_pipeline_handle_addUserId': '添加人ID',
  'mes_bpm_pipeline_handle_addUserId': 'mes_bpm_pipeline_handle_addUserId',
  '___mes_bpm_pipeline_handle_addTime': '添加时间',
  'mes_bpm_pipeline_handle_addTime': 'mes_bpm_pipeline_handle_addTime',
  '___mes_bpm_pipeline_handle_editUser': '最近更新人',
  'mes_bpm_pipeline_handle_editUser': 'mes_bpm_pipeline_handle_editUser',
  '___mes_bpm_pipeline_handle_editUserId': '最近更新人ID',
  'mes_bpm_pipeline_handle_editUserId': 'mes_bpm_pipeline_handle_editUserId',
  '___mes_bpm_pipeline_handle_lastEditTime': '最近更新时间',
  'mes_bpm_pipeline_handle_lastEditTime': 'mes_bpm_pipeline_handle_lastEditTime',
  '___mes_bpm_pipeline_handle_serverNumber': '服务器编号ID',
  'mes_bpm_pipeline_handle_serverNumber': 'mes_bpm_pipeline_handle_serverNumber',
  'mes_bpm_pipiline_handle_handleStage': 'mes_bpm_pipiline_handle_handleStage',
};
import * as  mesBpmHandleApi from '@/apis/mesBpmHandle.api.js';


export default {
  name: 'mesBpmPipelineHandlelist',
  data() {
    return {
      setTimeout,
      api: api,
      dicInner,
      ...formData,
      queryParams: {
        name: '',
        searchKey: '',
        'id': '',
        'bpmId': '',
        'bpmNodeId': '',
        'nodeCode': '',
        'deep': '',
        'handleCode': '',
        'handleId': '',
        'handleStage': '',
        'state': '',
        'remarks': '',
        'tenantType': '',
        'tenantId': '',
        'delState': '',
        'addUser': '',
        'addUserId': '',
        'addTime': '',
        'editUser': '',
        'editUserId': '',
        'lastEditTime': '',
        'serverNumber': '', ...PageData,
      },
      lists: [],
      selectRows: [],
      classId: '',
      classIdPath: '',
      className: '',
      loading: false,
      isFold: false,
      dataList: [],
      tableRowClassName({ row, rowIndex }) {
        if (row.rowType == 'total') {
          return 'total-row';
        }
        return '';
      },
      visibleMap: {},
    };
  },
  components: {
    svgIcon: () => import('@codegenarate/svg-icon'),
    dicSelect: () => import('@/components/dicselect.vue'),
    dicTag: () => import('@/components/DicSelect/dic-tag.vue'),
    RightToolbar: () => import('@/components/RightToolbar/index.vue'),
    modify: () => import('@/forms/actvitiForm/bpmPipelineHandle/modify.vue'),
    eventhandlersModify: () => import('@/views/bnpmList/form/eventhandlers/modify.vue'),
  },
  mounted() {
  
  },
  filters: { dateFormatYYYYMMDD: dateFormatYYYYMMDD },
  computed: {},
  watch: {},
  methods: {
    ...formMethod,
    /**
     * @description:
     * @params  bpmId
     * @params  bpmNodeId
     * @params handleList
     * @return
     */
    async initByDialog(_data) {
      this.queryParams.bpmNodeId = _data && _data.bpmNodeId;
      this.queryParams.bpmId = _data && _data.bpmId;
      //this.getInfoList();
      var templist = _data && _data.handleList || [];
      //填充 handlerData
      for (let i = 0; i < templist.length; i++) {
        var handleId = templist[i].handleId;
        if (handleId) {
          var result = await mesBpmHandleApi.getItem(handleId);
          var handlerData = result && result.data;
          templist[i].handlerData = handlerData;
        }
      }
      
      
      this.dataList = templist;
    },
    async triggerSeeHanlder(row) {
      await FormDialog({
        title: '查看明细',
        width: '666px',
        data() {
          return {
            action: 'readOnly',
            id: row&&row.handleId,
          };
        },
        components: {
          modify: () => import('@/views/bnpmList/form/eventhandlers/modify.vue'),
        },
      });
    },
    
    tableRowClickOnece(row, tableRef, options) {
      var table = this.$refs[tableRef];
      if (options && options.canSelect) {
        var istrue = options.canSelect(row);
        if (!istrue) {
          table && table.toggleRowSelection(row, false);
        }
      }
      table && table.clearSelection();
      table && table.toggleRowSelection(row);
    }, async triggerModify(row) {
      var self = this;
      var result = await FormDialog({
        width: '555px', title: row?.id ? '编辑执行器' : '新增执行器', data() {
          return {
            ...row,
            bpmId: self.queryParams.bpmId,
            bpmNodeId: self.queryParams.bpmNodeId,
            dataList: self.dataList,
          };
        }, components: { modify: () => import('./modify.vue') },
      });
      if (!(result && result.success)) {
        return result;
      }
      this.getInfoList();
    },
  },
};</script>
